<template>
    <el-dialog :title="title" :visible.sync="show" :append-to-body="true" :close-on-click-modal="false" @opened="showModal" @closed="closeModal">
        <el-form ref="moneyChange" label-position="right" label-width="80px" :model="moneyChange" :rules="moneyRules">
            <input type="hidden" :model="moneyChange.id" />
            <el-form-item :label="$t('数量')" prop="count">
                <el-input size="small" v-model="moneyChange.count" type="number" placeholder="数量" style="width: 240px" />
            </el-form-item>
            <el-form-item :label="$t('备注')" prop="remark">
                <el-input size="small" type="textarea" v-model="moneyChange.remark" :placeholder="$t('备注')" style="width: 240px" />
                <div>
                    <el-tag color="success" type="border" :checkable=true @click="moneyChange.remark='仓库盘点'">仓库盘点</el-tag>
                    <el-tag color="success" type="border" :checkable=true @click="moneyChange.remark='部分配件'">部分配件</el-tag>
                    <el-tag color="success" type="border" :checkable=true @click="moneyChange.remark='线下发货'">线下发货</el-tag>
                </div>
            </el-form-item>
        </el-form>
        <div slot="footer">
            <el-button size="small" @click="cancel">取消</el-button>
            <el-button size="small" type="primary" :loading="modalMoneyLoading" @click="ok">确定</el-button>
        </div>
    </el-dialog>

</template>

<script>
import {getStorageProductChangeList} from "@/api/TradeApi"
export default {
    name: 'CStorageProduct',
    data() {
        return {
            title: "出库操作",
            productId: null,
            show: false,
            modalMoneyLoading: false,
            moneyChange: {
                type: 1,
                count: 0,
                remark: "仓库盘点",
                productId: null,
            },
            moneyRules: {
                count: [{
                    required: true,
                    message: "数量不能为空,或格式不对",
                }],
                remark: [{
                    required: true,
                    message: "备注不能为空",
                }]
            },

        };
    },
    props: [

    ],
    mounted: function() {


    },
    computed: {

    },
    methods: {
        showModal: function() {

        },
        showDialog(id) {
            this.productId = id;
            this.show=true;
        },
        closeModal: function() {
            this.moneyChange.remark = "仓库盘点";
        },
        ok: function() {
            var me = this;
            this.$refs['moneyChange'].validate((valid) => {

                if (valid) {
                    if (this.moneyChange.count <= 0) {
                        this.errorMessage('请认真填写数量');
                        return;
                    }

                    var url = "/storageproduct/doStock.do";
                    me.moneyChange.productId = me.productId;
                    me.moneyChange.type = me.type;
                    me.modalMoneyLoading = true;
                    me.$http.post(url, me.moneyChange).then(response => {
                        var body = response;
                        if (body.status == 0) {

                            me.successMessage("操作成功");
                            me.moneyChange = {
                                type: 1,
                                count: 0,
                                remark: "仓库盘点",
                                productId: null
                            };
                            me.show = false;
                            me.$emit('ok');


                        } else {
                            me.errorMessage(body.info);
                        }
                        me.modalMoneyLoading = false;
                    }, response => {
                        me.modalMoneyLoading = false;
                    });
                } else {
                    this.errorMessage('请认真填写数据');
                }
            });


        },
        cancel: function() {
            this.show = false;
            this.$emit('cancel');
        }
    }
}
</script>